<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>实现数组去重的方法</title>
</head>

<body>
	<script>
		/*
			+数组去重的实现方法
				==>方法一：es6的Set（ES6中提供了Set数据容器，这是一个能够存储无重复值的有序列表。）
				==>方法二：indexOf和filter方法
				==>方法三：用对象属性存在的特性
				==>方法四：循环和includes
				==>方法五：循环和splice 
				==>方法六：循环和lastIndexOf
				==>方法七：将元素一一比较
				==>方法八：	将元素排序后一一比较
		*/
		let arr1 = [1, 1, 3, 4, 5, 6, 7, 4, 7, 7, 9]
		let arr2 = new Set(arr1)
		let [...arr3] = arr2
		console.log(arr1)
		console.log(arr2)
		console.log(arr3)
		console.log(arr1 instanceof Array) //true
		console.log(arr2 instanceof Array) //false
		console.log(arr3 instanceof Array) //true
		// arr1.add()
		//arr1.size
		//arr1.has()
		// arr1.delete()
		//扩展运算符转换成数组
		// Array.from(new Set(arr1)); // 利用Array.from将Set结构转换成数组
		// let [...arr2] = arr3;
		// console.log(arr2)
		// console.log(arr1 instanceof Array) //false
		// console.log(arr3 instanceof Array) //true



		//利用 ES6的set 方法。
		function unique1(arr) {
			//Set数据结构，它类似于数组，其成员的值都是唯一的
			//Array.from:方法从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例
			return Array.from(new Set(arr)); // 利用Array.from将Set结构转换成数组
		}

		//方法二indexOf和filter
		let arr = [1, 1, 3, 4, 5, 6, 7, 4, 7, 7, 9]
		function unique2(arr) {
			var res = arr.filter(function (item, index, array) {
				// console.log(item)
				console.log(index)
				// console.log(array)
				console.log(array.indexOf(item))
				console.log("--------------")
				//只会匹配一个第一个下标相同的index，然后放进去res数组中返回
				return array.indexOf(item) === index
			})
			return res
		}
		console.log(unique(arr))

		//利用对象属性存在的特性，如果没有该属性则存入新数组。
		function unique3(arr) {
			var obj = {}
			var newArr = []
			for (let i = 0; i < arr.length; i++) {
				if (!obj[arr[i]]) {
					obj[arr[i]] = 1
					newArr.push(arr[i])
				}
			}
			return newArr
		}

		//利用数组的includes来查询。
		function unique4(arr) {
			var newArr = []
			for (var i = 0; i < arr.length; i++) {
				if (!newArr.includes(arr[i])) {
					newArr.push(arr[i])
				}
			}
			return newArr
		}

		function unique4(arr) {
			var newArr = []
			newArr = arr.filter(function (item) {
				return newArr.includes(item) ? '' : newArr.push(item)
			})
			return newArr
		}

		function unique4(arr) {
			let newArr = [];
			arr.forEach(item => {
				return newArr.includes(item) ? '' : newArr.push(item);
			});
			return newArr;
		}

		//利用数组原型对象上的 splice 方法。
		function unique5(arr) {
			var i, j, len = arr.length;
			for (i = 0; i < len; i++) {
				for (j = i + 1; j < len; j++) {
					if (arr[i] == arr[j]) {
						arr.splice(j, 1);
						len--;
						j--;
					}
				}
			}
			return arr;
		}

		//利用数组原型对象上的 lastIndexOf 方法。
		function unique6(arr) {
			var res = [];
			for (var i = 0; i < arr.length; i++) {
				//lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置，从该字符串的后面向前查找。如果要检索的元素没有出现，则该方法返回 -1。
				(res.lastIndexOf(arr[i])) !== -1 ? '' : res.push(arr[i]);
			}
			return res;
		}

		//思路：定义一个新数组，并存放原数组的第一个元素，然后将元素组一一和新数组的元素对比，若不同则存放在新数组中。
		function unique7(arr) {
			let newArr = [arr[0]];
			for (let i = 1; i < arr.length; i++) {
				let repeat = false;
				for (let j = 0; j < newArr.length; j++) {
					if (arr[i] === newArr[j]) {
						repeat = true;
						break;
					} else {

					}
				}
				if (!repeat) {
					newArr.push(arr[i]);
				}
			}
			return newArr;
		}

		//思路：先将原数组排序，在与相邻的进行比较，如果不同则存入新数组。
		function unique8(arr) {
			var formArr = arr.sort()
			var newArr = [formArr[0]]
			for (let i = 1; i < formArr.length; i++) {
				if (formArr[i] !== formArr[i - 1]) {
					newArr.push(formArr[i])
				}
			}
			return newArr
		}

	</script>
</body>

</html>